<template>
  <div>
    <navigation-bar>
      <div class="searchContent">
        <el-input
          v-model="name"
          placeholder="请输入名称"
          size="mini"
          style="width: 150px; margin-right: 10px"
        ></el-input>
        <custom-button
          type="search"
          style="margin-right: 10px"
          @searchClick="searchClick"
        ></custom-button>
        <custom-button
          type="reset"
          style="margin-right: 10px"
          @resetClick="resetClick"
        ></custom-button>
        <custom-button
          type="add"
          style="margin-right: 10px"
          @addClick="addClick"
        ></custom-button>
        <custom-button
          type="download"
          style="margin-right: 10px"
          @downloadClick="exportXls"
          title="下载Excel模板"
        ></custom-button>
        <custom-button
          type="import"
          @uploadSuccess="pageChange(1)"
          importUrl="/ccdc/cfg/expFilterInquiry/importExcel"
          title="导入Excel"
        ></custom-button>
      </div>
    </navigation-bar>
    <table-index
      :dataSource="dataSource"
      :tableColumns="tableColumns"
      :btnList="btnList"
      :pageSize="pageSize"
      :pageCount="pageCount"
      :pageNo="pageNo"
      @pageChange="pageChange"
      @editRow="editRow"
      @viewRow="viewRow"
      @deleteRow="deleteRow"
    ></table-index>

    <div v-if="dialogShow">
      <custom-dialog
        :title="dialogTitle"
        size="large"
        @dialogClose="dialogClose"
      >
        <form-index
          ref="form"
          :formConfig="formConfig"
          @submit="submit"
          :type="type"
          @formCheckChange="formCheckChange"
        >
          <!--  <div>这里还可以插入其它内容进行拓展</div> -->
        </form-index>
      </custom-dialog>
    </div>
  </div>
</template>

<script>
import { ConsultationConfigurationFormConfig } from "@/assets/form/managementCenter/testConfiguration/filterPeriodConfiguration/consultationConfigurationForm";
import customDialog from "@/components/customComponents/customDialog";
import customButton from "@/components/customComponents/customForm/customButton";
import formIndex from "@/components/customComponents/customForm/formIndex";
import tableIndex from "@/components/customComponents/customeTable/tableIndex";
import navigationBar from "@/components/customComponents/managementCenter/navigationBar";
import { AjaxCommon, AjaxCommonExcelDownload } from "@/libs/apiCommon";
import { PopupCommon } from "@/libs/popupCommon";
import { SessionCommon } from "@/libs/sessionCommon";
import { Utility } from "@/libs/utility";
export default {
  components: {
    navigationBar,
    customButton,
    tableIndex,
    customDialog,
    formIndex,
  },
  data() {
    return {
      name: "",
      signPrefix: "",
      // table 相关参数  begin
      dataSource: [],
      tableColumns: [
        // {
        // 	prop: "type",
        // 	label: "类型",
        // },
        {
          prop: "name",
          label: "名称",
          width: 400,
        },
        {
          prop: "explains",
          label: "说明",
          align: "left",
        },
        {
          prop: "options",
          label: "选择项配置",
          dictName: "select_option",
          width: 300,
        },
        {
          prop: "optionNum",
          label: "选择项数",
          width: 110,
        },
        {
          prop: "sort",
          label: "排序",
          width: 110,
        },
      ],
      btnList: ["edit", "view", "delete"],
      pageSize: 20,
      pageCount: 100,
      pageNo: 1,
      // table 相关参数  end

      // 弹窗是否显示
      dialogShow: false,
      // 弹窗标题 (新增修改不同)
      dialogTitle: "",

      // form的配置信息
      formConfig: ConsultationConfigurationFormConfig,
      type: "add",
    };
  },

  methods: {
    formCheckChange(e, name) {
      console.log(name);
      const formValue = this.$refs.form.getFormValue();
      formValue.optionNum = e.value.length;
      this.$refs.form.changeFormValue(formValue);
    },
    submit(d) {
      let self = this;
      if (d.id) {
        AjaxCommon("/ccdc/cfg/exp/filter/expFilterInquiry/edit", "post", d)
          .then((res) => {
            if (res.data.code == 200) {
              PopupCommon.notify("success", "操作成功");
              self.initPage();
              self.dialogClose();
            } else {
              PopupCommon.notify("error", res.data.message);
            }
          })
          .catch((err) => {
            PopupCommon.notify("error", err.message);
          });
      } else {
        delete d.id;
        AjaxCommon("/ccdc/cfg/exp/filter/expFilterInquiry/add", "post", d)
          .then((res) => {
            if (res.data.code == 200) {
              PopupCommon.notify("success", "操作成功");
              self.initPage();
              self.dialogClose();
            } else {
              PopupCommon.notify("error", res.data.message);
            }
          })
          .catch((err) => {
            PopupCommon.notify("error", err.message);
          });
      }
    },
    dialogClose() {
      this.dialogShow = false;
    },
    searchClick() {
      this.pageNo = 1;
      this.initPage();
    },
    resetClick() {
      this.name = "";
      this.signPrefix = "";
    },
    addClick() {
      let formConfigItem = this.formConfig;
      formConfigItem.map((t) => {
        Object.keys(t).map((res) => {
          if (res == "fieldName") {
            if (t[res] == "optionNum") {
              t.filedValue = 1
            }else{
              t.filedValue = "";
            }
          }
        });
      });
      this.formConfig = formConfigItem;
      this.type = "add";
      this.dialogShow = true;
      this.dialogTitle =
        "新增" + JSON.parse(SessionCommon.getCurrentMenuInfo()).title;
    },
    // 分页点击事件
    pageChange(p) {
      this.pageNo = p;
      this.initPage();
    },
    editRow(d) {
      this.type = "edit";
      let formConfigItem = this.formConfig;
      formConfigItem.map((t) => {
        Object.keys(t).map((res) => {
          if (res == "fieldName") {
            t.filedValue = d.data[t[res]];
          }
        });
      });
      this.formConfig = formConfigItem;
      this.dialogShow = true;
      this.dialogTitle =
        "编辑" + JSON.parse(SessionCommon.getCurrentMenuInfo()).title;
    },
    viewRow(d) {
      this.type = "look";
      let formConfigItem = this.formConfig;
      formConfigItem.map((t) => {
        Object.keys(t).map((res) => {
          if (res == "fieldName") {
            t.filedValue = d.data[t[res]];
          }
        });
      });
      this.formConfig = formConfigItem;
      this.dialogShow = true;
      this.dialogTitle =
        "查看" + JSON.parse(SessionCommon.getCurrentMenuInfo()).title;
    },
    deleteRow(d) {
      const id = d.data.id;
      let self = this;
      AjaxCommon(
        "/ccdc/cfg/exp/filter/expFilterInquiry/delete?id=" + id,
        "delete",
        { optReason: d.optReason }
      ).then((res) => {
        console.log(res, "res...............");
        if (res.data.code == 200) {
          PopupCommon.notify("success", "删除成功");
          self.initPage();
          self.dialogClose();
        } else {
          PopupCommon.notify("error", res.data.message);
        }
      });
    },
    // 初始化事件
    initPage() {
      let self = this;
      AjaxCommon("/ccdc/cfg/exp/filter/expFilterInquiry/listByPage", "post", {
        name: this.name,
        pageNo: this.pageNo,
        pageSize: this.pageSize,
      }).then((res) => {
        if (res.data.code == 200) {
          self.dataSource = res.data.result.records;
          self.pageCount = res.data.result.total;
        } else {
          PopupCommon.notify("error", res.data.message);
        }
      });
    },
    exportXls() {
      let title = "筛选期问诊配置"
      AjaxCommonExcelDownload(
        "/ccdc/cfg/expFilterInquiry/exportXls?title=" + title
      ).then(
        (response) => {
          const blob = new Blob([response.data], {
            type: "application/vnd.ms-excel",
          });
          const link = document.createElement("a");
          link.href = window.URL.createObjectURL(blob);
          link.download = title + ".xls";
          link.click();
        },
        (error) => {
          console.log(error.message);
        }
      );
    },
  },
  mounted() {
    console.log(Utility.getDictList("select_option"));
    this.initPage();
  },
};
</script>

<style></style>
